import { Component, Prop } from 'vue-facing-decorator'
import Render from '@/render/Render'
import toNative from '@/utils/toNative'
import PreviewPdf from './PreviewPdf'
import PreviewImage from './PreviewImage'

export enum BtnTypeEnum {
    primary = 'blue-100',
    danger = 'red',
    default = 'black-200',
    white = 'white'
}

export type BtnType = keyof typeof BtnTypeEnum

@Component
export class PreviewImageOrPdf extends Render {
    @Prop() src!: string | null
    @Prop({default: '点击查看'}) text?: string
    @Prop({default: 'default'}) type?: BtnType
    @Prop({default: false}) hover?: boolean

    isPdf(file: string) {
        return file?.endsWith?.('.pdf')
    }

    render() {
        return this.src ? (
            this.isPdf(this.src) ? (
                <PreviewPdf src={this.src} hover={this.hover} text={this.text} type={this.type}/>
            ) : (
                <PreviewImage src={this.src} hover={this.hover} text={this.text} type={this.type}/>
            )
        ) : (
            <>--</>
        )
    }
}

export default toNative<{src: string | null; text?: string; type?: BtnType; hover?: boolean}, {}>(PreviewImageOrPdf)